﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>03 ProgressBar: JQueryUi Test</title>
	<!-- -->
	<style type="text/css">
		body, html {
			width: 100%;
			height: 100%;
			margin: 0;
			overflow: hidden;
			font-family: "Segoe UI", Arial, Verdana;
			font-size: 9pt;
		}
	</style>
	<script src="../../../bootloader.js" type="text/javascript"></script>
	<!-- -->
	<script type="text/javascript">
		go = function() {
			view = new opus.View({
				width: "100%",
				height: "100%",
				styles: {border: 1, padding: 8, borderColor: "green"},
				controls: [
					{name: "editor", type: "Editor", w:100, value: 10, keyupHandler: function(e) {
						if (e.keyCode == kit.keys.ENTER) {
							view.$.widget.setValue(Number(this.getValue()));
						}
					}},
					{type: "Button", caption: "set to 50", t: 40, w: 100, h: 30, onclick: "buttonClick"},
					{name: "widget", type: "opus.jqueryui.ProgressBar", value: 10, t: 80, w: "100%", h: 40, onchange: "progressChange"}
				],
				progressChange: function(inSender, inValue) {
					this.$.editor.setValue(inValue);
				},
				buttonClick: function() {
					this.$.widget.setValue(50);
				}
			});
		}
	</script>
</head>
<body onload="go()">
</body>
</html>
